<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
        <title>JQuery Validation Engine</title>
        <link rel="stylesheet" href="../css/validationEngine.jquery.css" type="text/css"/>
        <link rel="stylesheet" href="../css/template.css" type="text/css"/>
        <script src="../js/jquery-1.5.1.min.js" type="text/javascript">
        </script>
        <script src="../js/languages/jquery.validationEngine-en.js" type="text/javascript" charset="utf-8">
        </script>
        <script src="../js/jquery.validationEngine.js" type="text/javascript" charset="utf-8">
        </script>
        <script>
            jQuery(document).ready(function(){
                // binds form submission and fields to the validation engine
                jQuery("#formID").validationEngine();
            });
        </script>
    </head>
    <body>
        <p>
            <a href="#" onclick="jQuery('#formID').validationEngine('showPrompt', 'This is an example', 'pass', true)">Build a prompt on form</a>
            | <a href="#" onclick="jQuery('#url').validationEngine('showPrompt', 'This a custom msg', 'error', true)">Build a prompt on field</a>
            | <a href="#" onclick="jQuery('#legendid').validationEngine('showPrompt', 'This a custom msg', 'load', true)">Build a prompt on something else</a>
            | <a href="#" onclick="jQuery('#formID').validationEngine('hideAll')">Close all prompts</a>
			| <a href="index.html" >Back to index</a>
        </p>
        <p>
            This demonstration shows how you can use the API to create prompts.
            IMPORTANT: Prompts can only apply to elements with an ID
        </p>
        <form id="formID" class="formular" method="post" action="">
            <fieldset>
                <legend>
                    Phone
                </legend>
                <label>
                    <span>Phone : </span>
                    <input value="+1 305 768 23 34 ext 23 BUG" class="validate[required,custom[phone]] text-input" type="text" name="telephone" id="telephone" />
                </label>
            </fieldset>
            <fieldset>
                <legend>
                    URL
                </legend>
                <label>
                    URL begin with http:// https:// or ftp://
                    <br/>
                    <span>Enter a URL : </span>
                    <input value="http://" class="validate[required,custom[url]] text-input" type="text" name="url" id="url" />
                </label>
            </fieldset>
            <fieldset>
                <legend id="legendid">
                    Email
                </legend>
                <label>
                    <span>Email address : </span>
                    <input value="forced_error" class="validate[required,custom[email]] text-input" type="text" name="email" id="email" />
                </label>
            </fieldset>
        </form>
    </body>
</html>